<script lang="ts" setup>


import { Page, useVbenModal } from '@vben/common-ui'


import { useVbenForm,  } from '#/adapter/form'
import {message, Tag} from "ant-design-vue";
import {ref} from "vue";
import {daochuContractNew, getCompanyList} from "#/api/goodsPurchase";

const  goods_purchase_sns:any =ref([])

const companyList =ref()
async function getList (){
    const  data =  await getCompanyList()
  companyList.value= data.map((item: any) => ({
    label:item.name,
    value:item.id,
  }))
}
const [Modal, modalApi] = useVbenModal({

  onCancel() {
    modalApi.close()
  },
  async onConfirm() {
    modalApi.lock(true)
     const  values  =await baseFormApi.getValues()
    daochuContractNew(values).then((res:any) => {
      console.log(res)

      if(res.data.code === 1){
        window.open(res.data.data.oss_file_path)
      }else {
        message.error(res.data.msg)
      }
      modalApi.unlock()
    })


  },
  onOpenChange: async (isOpen: boolean) => {
    getList()
    if (!isOpen) return
    const { id } = modalApi.getData<Record<string, any>>()
    await baseFormApi.setValues({
      contract_type: '1',
      company_name: '南昌岳歌服饰有限公司',
      id_arr:id
    }, false)
  },
})

const [BaseForm, baseFormApi] = useVbenForm({
  // 所有表单项共用，可单独在表单内覆盖
  showDefaultActions: false,
  commonConfig: {
    // 在label后显示一个冒号
    colon: true,
    // 所有表单项
    componentProps: {
      class: 'w-full',
    },
  },

  layout: 'horizontal',
  schema: [
    {
      component: 'Select',
      componentProps: {
        allowClear: true,
        filterOption: true,
        options: [
          {
            label: '订单合同',
            value: '1',
          },
          {
            label: '框架合同',
            value: '2',
          },
          {
            label: '成品单简易框架合同',
            value: '3',
          },
          {
            label: '成品单鞋类框架合同',
            value: '4',
          },

        ],
        showSearch: true,
      },
      fieldName: 'contract_type',
      label: '合同模板',
    },
    {
      component: 'Select',
      componentProps: {
        allowClear: true,
        filterOption: true,
        options: companyList,
        showSearch: true,
      },
      fieldName: 'company_name',
      label: '发票抬头',
      formItemClass: 'col-span-4',
    },
    {
      component: 'Select',
      fieldName: 'loss',
      formItemClass: 'col-span-4',
      label:'牛仔损耗率',
      componentProps: {
        allowClear: true,
        filterOption: true,
        options: [
          {
            label: '1%',
            value: '1%',
          },
          {
            label: '2%',
            value: '2%',
          },
        ],
        showSearch: true,
      },
    },
  ],
  wrapperClass: 'grid-cols-1',
})





</script>

<template>
  <Modal title="合同导出" >
    <Page content-class="flex flex-col gap-4" description="" >
      <BaseForm>
        <template #_divider>
          <div style="overflow-y: auto">
            <template  v-for="(item, index) in goods_purchase_sns" :key="index">
              <Tag >
                {{ item.goods_purchase_sn}}
              </Tag>
            </template>
          </div>
        </template>
      </BaseForm>

    </Page>
  </Modal>
</template>

<style scoped>
/* 让 Form.Item 不再有默认 margin-bottom */
.mb-0 {
  margin-bottom: 0 !important;
}
</style>
